Skip to content

fix(table): updated nested sticky header example with isBorderRow tr#12527

Merged
kmcfaul merged 2 commits into
patternfly:mainfrom
mcoker:nested-sticky-header-docs
Jun 25, 2026
Merged

fix(table): updated nested sticky header example with isBorderRow tr#12527
kmcfaul merged 2 commits into
patternfly:mainfrom
mcoker:nested-sticky-header-docs

Conversation

@mcoker

@mcoker mcoker commented Jun 25, 2026 •
edited by coderabbitai Bot
Loading

Copy link
Copy Markdown
Contributor

Updates the nested sticky header docs and example to have <Tr isBorderRow>, which is required for sticky, nested column header tables.

Summary by CodeRabbit

  • Documentation

    • Added a note in the nested column headers guide explaining that when the table uses a sticky header, the header section needs an extra row to keep the bottom border visible.

  • Bug Fixes

    • Updated the nested sticky header example to render correctly inside a fixed-height container, improving scrolling and sticky header behavior.

@mcoker mcoker requested review from kmcfaul and thatblindgeye June 25, 2026 19:54
@coderabbitai

coderabbitai Bot commented Jun 25, 2026 •
edited
Loading

Copy link
Copy Markdown

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 606fa4cc-1949-47af-b90b-fdb34f78fc44

📥 Commits

Reviewing files that changed from the base of the PR and between 4d09b88 and ef54927.

📒 Files selected for processing (1)
  • packages/react-table/src/components/Table/examples/TableNestedStickyHeader.tsx
🚧 Files skipped from review as they are similar to previous changes (1)
  • packages/react-table/src/components/Table/examples/TableNestedStickyHeader.tsx

Walkthrough

The nested sticky header example now renders inside a fixed-height wrapper. The nested column header documentation adds a note that sticky headers need an extra Tr with isBorderRow for the bottom border.

Changes

Nested sticky header example and docs note

Layer / File(s) Summary
Example wrapper and sticky-header note
packages/react-table/src/components/Table/examples/TableNestedStickyHeader.tsx, packages/react-table/src/components/Table/examples/Table.md		 The nested sticky table example is wrapped in a fixed-height outer div, and the nested column headers docs add the isBorderRow note for sticky headers.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~5 minutes

Suggested labels

Needs design review

Suggested reviewers

  • thatblindgeye
  • wise-king-sullyman
🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title clearly reflects the main nested sticky header example change and mentions the new isBorderRow Tr requirement.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

coderabbitai[bot]
coderabbitai Bot reviewed Jun 25, 2026
View reviewed changes

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents 
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In
`@packages/react-table/src/components/Table/examples/TableNestedStickyHeader.tsx`:
- Line 164: The TableNestedStickyHeader example has a stray literal backslash
between cells inside the row, which leaves an extra text node in the rendered
output. Remove the trailing backslash from the `<Tr>` content in the
`TableNestedStickyHeader` example so the row only contains the intended `<Td>`
elements.
🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

  • Push a commit to this branch (recommended)
  • Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 8c71f6ba-7348-450e-85e0-4fba8c8d95cb

📥 Commits

Reviewing files that changed from the base of the PR and between 894e315 and 4d09b88.

📒 Files selected for processing (2)
  • packages/react-table/src/components/Table/examples/Table.md
  • packages/react-table/src/components/Table/examples/TableNestedStickyHeader.tsx

Comment thread packages/react-table/src/components/Table/examples/TableNestedStickyHeader.tsx Outdated
@patternfly-build

patternfly-build commented Jun 25, 2026 •
edited
Loading

Copy link
Copy Markdown
Collaborator

Preview: https://pf-react-pr-12527.surge.sh

A11y report: https://pf-react-pr-12527-a11y.surge.sh

@kmcfaul kmcfaul merged commit 5a70995 into patternfly:main Jun 25, 2026
15 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@coderabbitai coderabbitai[bot] coderabbitai[bot] left review comments
@kmcfaul kmcfaul kmcfaul approved these changes
@thatblindgeye thatblindgeye thatblindgeye approved these changes

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

4 participants

@mcoker @patternfly-build @kmcfaul @thatblindgeye